<template>
  <div class="bk-btn-box">
    <div v-for="(ele, ind) in btnConfig" :key="ind" class="bk-btn-ele">
      <el-button
        :size="ele.size || 'small'"
        :type="ele.type || 'primary'"
        :plain="ele.plain || false"
        :round="ele.round || false"
        :circle="ele.circle || false"
        :icon="ele.icon"
        :loading="ele.loading"
        :disabled="ele.disabled === undefined ? false : ele.disabled"
        v-if="!ele.slotName "
        v-throttle="{
          fn: ele.Fn,
          event: ele.EventFn || 'click',
          delay: ele.delay,
        }"
        >{{ ele.label }}</el-button
      >
      <!-- <div v-else :slot="ele.name"></div> -->
      <slot v-else :name="ele.slotName"></slot>
    </div>
  </div>
  <!-- v-show="ele.show === undefined ? true : ele.show" -->
</template>

<script>
export default {
  props: {
    btnConfig: {
      type: Array,
      default: () => [],
    },
  },
  components: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="less">
.bk-btn-ele{
  display: inline-block;
  margin-right: 5px;
  vertical-align: bottom;
  .el-checkbox{
    padding: 6px 15px!important;
  }
}

</style>
